@import '../../assets/libs/iconfont.css';
@import '../../assets/css/reset.css';
@import '../../assets/css/common.css';
@import '../../assets/css/property.css';
@import '../../assets/libs/demo.css';
.Isnew{color: black;font-weight:bold;}
.API{
    color: black;
} 

.api-id li .cbutton.active{display: none;}
.on{display: block;}
.onm{color: #03c5ff;}
.red{color: red;}
.green{color: green;}
.icon-gouwuche{margin-left: 462px; font-weight: bold; font-size: 30px; color: black;}
.api-top{
    height: 180px;
    
    padding-top: 140px;
    ul{flex-wrap: wrap; li{
        text-align: center;
        width: 97px;
        border: 1px solid #eeeeee;
        margin: 10px;
        border-radius: 15px;
       
    }
            li:hover{background-color: aquamarine;
           
            
            }

        
    }
}
.search{
    .icon-gouwuche{
        font-size: 40px;
        position: absolute;
        margin: -5px 0 0 130px ;
        color: black;
        font-weight: 1000;
     }
     input{height: 25px; border-radius: 20px;}

}
.api-id{
    ul{
        flex-wrap: wrap;
        li{ position: relative;
            display: flex;
            flex-direction: column;
            align-items: center;
            border: 1px solid #f0f0f0;
            height: 260px;
            width: 229px;
            margin: 3px;
            justify-content: center;
            cursor:pointer;
        }
    }
    h4{position: absolute;top: 10px; left: 10px;}
    h3{margin: 20px;}
    .cbutton{
     background-color: #00bdff;
     color: #ffff;
     width: 180px;
     height: 40px;
     margin-top: 20px;
    }
}
.api-button{
    height: 50px;
    width: 480px;
    li{
        cursor:pointer;
    
display: flex;
align-items: center;
height: 40px;
width: 100px;
margin: 3px;
justify-content: center;
border-radius: 50%;
P{
    width: 150px;
    color: #00c3ff;
}
    }
    li:first-child{
        background-color:#00bdff ;
    }
}

.ModalFrame{
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    top:0;
    left: 0;

    .main {
    
        margin: 0 auto;
        background-color: #ffffff;
        cursor: pointer;
        text-align: center;
        height: 580px;
        width: 400px;
        position: fixed;
        right: 30%;
        top: 22%;
    
    
        h4 {
            margin: 20px 0 0 255px;
            color: #03c5ff;
        }
    
        .login {
            margin-bottom: 30px;
            font-size: 20px;
    
            h1 {
                font-size: 10px;
            }
    
            
        }
    
        .name-word {
            height: 300px;
            .username input,
            .password input {
                margin: 10px;
                height: 50px;
                width: 92%;
                border: none;
                border-bottom: 1px solid #e7e7e7;
                border-radius: 50px;
                text-align: center;
            }
    
            .username input {
                background: url(../../assets/imgs/loginIcon.png)no-repeat;
                background-position: -48px 15px;
            }
    
            .password input {
            
                background-position: 4px 10px;
                background-size: 29px;
            }
    
            button {
                width: 92%;
                height: 50px;
                background-color: #03c5ff;
                color: #fff;
            }
    
    
        }
    
    
        .Two-dimensional{height: 300px;
            text-align: center;
          background-color: #fcfcfc;
         line-height: 30px;
           img{margin-top: 50px;}
        }
    }
    .rgd {
        background: url(../../assets/imgs/yulan.svg)no-repeat;
        background-position: 265px -3px;
        background-size: 19px;
    
        a {
            color: #00a7f2;
        }
    }
    #imgx{
       position: absolute;
       margin: 19px 0 0 14px;
       object-fit: cover;
    }
}

